<!--
 * @Description: 
 * @Author: Zhangx
 * @Date: 2023-06-19 15:01:00
 * @LastEditors: Zhang_xx
 * @LastEditTime: 2025-02-17 15:44:47
-->
<template>
  <tableList :tableColumns="state.tableColumns" :tableData="state.tableData" :multiple="true" :isOperate="true"
    @checkClick="checkClick" @getData="getData" operate="查看">
    <template #roomCode="{ row }">
      <span>{{ row.roomCode + 123 }}----123</span>
    </template>
  </tableList>
  <!-- <el-pagination
      :page-size="20"
      :pager-count="11"
      layout="prev, pager, next"
      :total="1000"
    /> -->
</template>

<script lang="ts" setup>
import { computed, reactive } from 'vue'
import tableList from '../component/useTables.vue'
// 配置项
const tableColumns = computed(() => {
  return [
    {
      prop: 'roomCode',
      label: '房间编码1',
      width: '',
      align: 'center',
      slot: 'roomCode'
    },
    {
      prop: 'fullRoomName',
      width: '',
      label: '房间编码2',
      align: 'center'
    },
    {
      prop: 'roomName',
      label: '房间编码3',
      width: '',
    },
    {
      prop: 'locationCode',
      label: '房间编码4',
      width: '',
    },
  ]
})
const state = reactive({
  tableColumns,
  tableData: [
    {
      roomCode: '',
      fullRoomName: '今天天气',
      roomName: '铜锣湾编号',
      locationCode: '房间地点'
    },
    {
      roomCode: '1111111111111111111111',
      fullRoomName: '今天天气',
      roomName: '铜锣湾编号',
      locationCode: '房间地点'
    }
  ]
})
const checkClick = () => {
  console.log('查看')
}
const getData = () => {
  console.log('查看22')
}
</script>